import { Typography } from 'antd';
import { CSSProperties, ReactElement } from 'react';
import CustomIcon from './CustomIcon';

const Title = ({ title, size, level, style, icon }: { title: string | ReactElement, level?: 1 | 2 | 3 | 4 | 5, size?: number, style?: CSSProperties, icon?: string | any }) => {
  const { Title } = Typography;
  const TitleStyle: CSSProperties = {
    fontSize: size,
    marginTop: 0,
    marginBottom: 12,
    ...style
  }
  return (<Title level={level} style={TitleStyle}>{icon && typeof icon === 'string' ?
    CustomIcon({ str: icon, style: { fontSize: size } }) : icon} {title}</Title>)
}

export default Title